<template>
  <div class="root">
      <header>
          <div>若您已安装了网易云音乐，</div>
          <div>请下拉并点击"打开"按钮</div>
          <div class="open">(若无打开按钮，则 <a href="#">点此打开</a>)</div>
      </header>
      <body>
          <div class="logo"></div>
          <div class="download">点击下载</div>
      </body>
  </div>
</template>

<script>
export default {

}
</script>

<style scoped lang="less">
.root {
    width: 100%;
    height: 17.7867rem;
    background-image: url('../../assets/bck-download.png');
    background-size: 100% 100%;
    header {
        font-size: .4267rem;
        text-align: center;
        padding: .4667rem;
        div {
            color: #fff;
        }
        .open {
            font-size: .32rem;
            color: #999;
            margin: .5333rem;
        }
    }
    body {
        text-align: center;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        .logo {
            width: 2.88rem;
            height: 2.88rem;
            background-color: #999999;
            background-image: url('../../assets/logo2.png');
            transform: translate((5.0667-2.88)/2rem);
            margin-bottom: 1rem;
            border-radius: .4333rem;
            background-size: 300% 200%;
            background-repeat: no-repeat;
            background-position: -2.88rem -1.44rem;
        }
        .download{
            height: 1.28rem;
            width: 5.0667rem;
            background-color: #3c2b29;
            text-align: center;
            line-height: 1.28rem;
            border: 1px solid #5f5959;
            border-radius: .1333rem;
            color: #FFF;
        }
    }
}
</style>